<template>
	<!-- 封装搜索栏 -->
	<view class="top">
		<view class="search">

			<text class="i iconfont icon-search"></text>
			<text class="txt">搜索</text>
		</view>

	</view>
</template>

<script>
</script>

<style lang="less">
	// 其实加不加scoped无所谓 因为 这个样式会生成对应的小程序 那个wxss文件中
	.top {
		width: 100%;
		height: 130rpx;
	
		background-color: #eb4450;
		box-sizing: border-box;
		padding: 20rpx 15rpx;
		position: fixed;
		top: 0;
		z-index: 1;
	
		.search {
			width: 100%;
			height: 100%;
			line-height: 90rpx;
			text-align: center;
			background-color: #fff;
			border-radius: 5rpx;
	
			.txt {
				color: #cccccc;
				margin-left: 5rpx;
	
			}
	
			.i {
				color: #cccccc;
				font-size: 26px;
				vertical-align: middle;
				margin-right: 5rpx;
			}
		}
	
	}
</style>
